<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>我的快件</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1">
    <style type="text/css">
        body {
            margin: 0;
            padding: 0;
            background-color: #eeeeee;
            font-family: "楷体";
        }

        .item {
            margin: 20px 20px 50px;
        }

        .imte_top {
            text-align: center;
        }

        .imte_top > span {
            font-size: 14px;
            display: inline-block;
            padding: 5px 12px;
            background-color: #ddd;
            color: #fff;
            border-radius: 5px;
        }

        .item_content {
            background-color: #fff;
            padding: 25px 15px;
            margin-top: 6px;
        }

        .item_content_top_1 {
            font-size: 24px;
            font-weight: bold;
        }

        .item_content_top_2 {
            color: #bbb;
            font-size: 14px;
            margin: 5px 0;
        }

        .item_content_top_3 {
            margin: 10px 0;
        }

        .item_content_top_4 {
            margin: 10px 0;
        }

        .item_content_bottom > a {
            text-decoration: none;
            color: #33e;
        }

        .notice {
            color: #999;
            font-size: 14px;
            margin: 10px auto;
            display: block;
            width: max-content;
        }
    </style>
</head>
<body>
<div class="content"></div>
<div class="content"></div>
<script src="js/jquery.min.js"></script>
<script>
    $(function () {
        var $content0 = $(".content:eq(0)");
        var $content1 = $(".content:eq(1)");
        $.getJSON("/express/getAllExpresses.do", null, function (data) {
            if (data.status === 0) {
                for (let i = 0; i < data.data.notOut.length; i++) {
                    let item = '<div class="item"><div class="imte_top"><span>' + data.data.notOut[i].intime + '</span></div><div class="item_content"><div class="item_content_top"><div class="item_content_top_1">取件通知</div><div class="item_content_top_2">' + data.data.notOut[i].intime + '</div><div class="item_content_top_3">您有一个包裹到e栈了!</div><div class="item_content_top_4">取件码:<span style="color:#05a">' + data.data.notOut[i].code + '</span><br>快递公司:' + data.data.notOut[i].company + '<br>运单号码:' + data.data.notOut[i].number + '<br>站点电话:' + data.data.notOut[i].sysphone + '<br>取件地址:学校快件集散中心<br></div></div><hr><div class="item_content_bottom"><a href="/code/personQRCode.do?type=express&code=' + data.data.notOut[i].code + '">取件二维码</a></div></div></div>'
                    $content0.append(item);
                }
                for (let i = 0; i < data.data.hadOut.length; i++) {
                    let item = '<div class="item"><div class="imte_top"><span>' + data.data.hadOut[i].intime + '</span></div><div class="item_content"><div class="item_content_top"><div class="item_content_top_1">取件成功通知</div><div class="item_content_top_2">' + data.data.hadOut[i].intime + '</div><div class="item_content_top_3">您有一个包裹从e栈取出了!</div><div class="item_content_top_4">快递公司:' + data.data.hadOut[i].company + '<br>运单号码:' + data.data.hadOut[i].number + '<br>站点电话:' + data.data.hadOut[i].sysphone + '<br></div></div><hr><div class="item_content_bottom"><a href="#">有疑问 ? 点了也没用</a></div></div></div>'
                    $content1.append(item);
                }
            } else if (data.status === -1) {
                $content0.append('<span class="notice">这里什么都没有呢...<span>');
            } else if (data.status === -2) {
                $content0.append('<span class="notice">要绑定手机号才能查到快递信息哦<span>');
            } else if (data.status === -404) {
                location.assign('/index.html');
            }
        });
    });
</script>
</body>
</html>